<template lang="html">
    <div id="subject">
        <section class="msearch-section ng-scope">
            <div class="msearch-input" style="box-shadow: 0px 7px 34px -12px #7A808F">
                <form class="ng-pristine ng-valid">
                    <input type="search" id="mindex-key" autocomplete="off" autocorrect="off" placeholder="请输入企业名" v-model="seachtext">
                    <button @click="seach()"></button>
                </form>
            </div>
        </section>
        <section class="job-list">
         
                <ul>
                    <li class="item" v-for="(item,index) in listData" :key='item.unid'>
                        <router-link :to='{name: "Enterprisedetails",query:{unid: item.unid}}'>
                            <div class="itemimg">
                              <img v-if="item.serverFilePath==null" src="../../assets/img/none.jpg">
                              <img v-else :src="'http://222.77.181.149:966'+item.serverFilePath"> 
                            </div>
                            <!-- <img v-else :src="item.serverFilePath"> -->
                            <div class="text">
                                <div class="title">
                                    <h4>{{item.name}}</h4>
                                    <!--<span class="salary">监管</span> --></div>
                                <div class="name">监管</div>
                                <div class="msg"><em>{{item.address}}</em></div>
                            </div>
                        </router-link>
                    </li>
                </ul>
          
             <div class="none_data" v-show="nonedata">
                <img src="../../img/tip.png">
                  <p>暂无该企业</p>
             </div>
        </section>
    </div>
</template>

<script>
   let DomainName = 'http://222.77.181.149:966/'
    import axios from 'axios';
    import {
        Loadmore
    } from 'mint-ui';
    import {
        EnterpriseList
    } from '../../api/api';
    
    export default {
        components: {
            'v-loadmore': Loadmore,
        },
        data() {
            return {
                name: '',
                listData: [],
                seachtext: '',
                /*分页*/
                limit: 0,
                nonedata:false,
                apiUrl:'http://222.77.181.149:966',
    
            };
        },
    
        //方法
        methods: {
           
    
            seach: function() {
                let options = {
                    params: {
                        name:this.seachtext,
                        areaUnid: '',
                    }
                }
                //调取接口
                EnterpriseList(options).then((res) => {
                    if (res.success === true) {
                        this.listData = res.data;
                         if(res.data.length>0){
                            this.nonedata=false
                        }else{
                              this.nonedata=true
                        }
                    }
                })
            },
            //数据加载方法
            getData() {
                let options = {
                    params: {
                        name: '',
                        areaUnid: '',
                    }
                }
                //调取接口
                EnterpriseList(options).then((res) => {
                    if (res.success === true) {
                        this.listData =res.data;
                          if(res.data.length>0){
                            this.nonedata=false
                        }else{
                              this.nonedata=true
                        }
                    }
                })
            }
        },
        //页面加载时候
           created() {
               this.getData()
           }
    }
</script>

<style lang="scss" scoped>
    .msearch-section {
        background: url(../../img/banner.png) no-repeat;
        width: 100%;
        padding-top: 51.5625%;
        background-size: 100%;
    }
    
    .msearch-input {
        display: block;
        border: 1px solid #BDC0C6;
        border-radius: 2px;
        height: 40px;
        margin: -65px 15px 0;
        line-height: 40px;
        background: #fff;
        color: #7a808f;
        input {
            width: 90%;
            padding-left: 15px;
            width: 90%;
            padding-left: 15px;
            height: 39px;
            border: none;
            box-sizing: border-box;
        }
        button {
            background: url(../../img/seach.png) center center no-repeat;
            width: 10%;
            background-size: 20px;
            display: block;
            height: 38px;
            border: 0;
            float: right;
        }
    }
    
    .job-list ul .item {
        height: 91px;
        position: relative;
    }
    
    .job-list ul .item a {
        display: block;
        height: 100%;
    }
    
    .job-list ul .itemimg {
        width: 59px;
        height: 59px;
        display: block;
        border: none;
        margin-left: 18px;
        margin-top: 16px;
        float: left;
        border-radius: 5px;
        border:1px solid  #efefef;
        display: -webkit-flex; /* Safari */
        display: flex;
        align-items:center;
         justify-content:center;
        img{
            width: 100%;
        }
    }
    
    .job-list .text {
        margin-left: 96px;
        position: relative;
    }
    
    .job-list .text h4 {
        font-size: 15px;
        color: #414a60;
        line-height: 15px;
        font-weight: 400;
        padding-top: 18px;
        margin-right: 90px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        margin: 0px;
    }
    
    .job-list .text .salary {
        font-style: normal;
        font-size: 15px;
        color: #FC6C38;
        position: absolute;
        right: 19px;
        top: 18px;
        line-height: 15px;
    }
    
    .job-list .text .name {
        font-size: 12px;
        color: #414a60;
        line-height: 28px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        margin-right: 19px;
    }
    
    .job-list .text .msg {
        line-height: 13px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        margin-right: 19px;
    }
    
    .job-list .text .msg em {
        font-style: normal;
        font-size: 12px;
        color: #8892ac;
        margin-right: 14px;
        display: inline-block;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        width: 100%;
    }
</style>
